<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>比较运算符(comparison operator)</title>
  <!-- 
    比较运算符用于比较两个值，并返回布尔值（ `true`  或  `false` ）。

    1. 相等运算符  `==` 
    - 比较两个值是否相等，进行类型转换。
    console.log(5 == '5'); // 结果为 true

    2. 全等运算符  `===` 
    - 比较两个值是否相等，不进行类型转换。
    console.log(5 === '5'); // 结果为 false

    3. 不等运算符  `!=` 
    - 比较两个值是否不相等，进行类型转换。
    console.log(5 != '5'); // 结果为 false

    4. 不全等运算符  `!==` 
    - 比较两个值是否不相等，不进行类型转换。
    console.log(5 !== '5'); // 结果为 true

    5. 大于运算符  `>` 
    - 检查左侧的值是否大于右侧的值。
    console.log(5 > 3); // 结果为 true

    6. 大于等于运算符  `>=` 
    - 检查左侧的值是否大于或等于右侧的值。
    console.log(5 >= 5); // 结果为 true

    7. 小于运算符  `<` 
    - 检查左侧的值是否小于右侧的值。
    console.log(3 < 5); // 结果为 true

    8. 小于等于运算符  `<=` 
    - 检查左侧的值是否小于或等于右侧的值。
    console.log(5 <= 5); // 结果为 true

  总结表

| 运算符 | 描述                             | 示例               | 结果   |
|--------|----------------------------------|--------------------|--------|
|  `==`    | 相等，进行类型转换               |  `5 == '5'`          | true   |
|  `===`   | 全等，不进行类型转换             |  `5 === '5'`         | false  |
|  `!=`    | 不等，进行类型转换               |  `5 != '5'`          | false  |
|  `!==`   | 不全等，不进行类型转换           |  `5 !== '5'`         | true   |
|  `>`     | 大于                             |  `5 > 3`             | true   |
|  `>=`    | 大于等于                         |  `5 >= 5`            | true   |
|  `<`     | 小于                             |  `3 < 5`             | true   |
|  `<=`    | 小于等于                         |  `5 <= 5`            | true   |

   -->
</head>
<body>

  <script>
    
    // 1. 相等运算符  `==` - 比较两个值是否相等，进行类型转换。
    console.log("1. 相等运算符  `==`", 5 == '5'); // 结果为 true
    let info = {name: '123', [Symbol.toPrimitive]() {return 123}}
    console.log("1. 相等运算符  `==`", 123 == info); // 结果为 true
    console.log("1. 相等运算符  `==`", 123 == [123]); // 结果为 true
    console.log("1. 相等运算符  `==`", 123 == [123, 456]); // 结果为 false

    // 2. 全等运算符  `===` - 比较两个值是否相等，不进行类型转换。
    console.log("2. 全等运算符  `===` ", 5 === '5'); // 结果为 false
    console.log("2. 全等运算符  `===` ", 123 === info); // 结果为 false
    // console.log("2. 全等运算符  `===` ", 123 === [123]); // 结果为 false

    // 3. 不等运算符  `!=` - 比较两个值是否不相等，进行类型转换。
    console.log("3. 不等运算符  `!=`", 5 != '5'); // 结果为 false
    console.log("3. 不等运算符  `!=`", 123 != info); // 结果为 false
    console.log("3. 不等运算符  `!=`", 123 != [123]); // 结果为 false

    // 4. 不全等运算符  `!==` - 比较两个值是否不相等，不进行类型转换。
    console.log("4. 不全等运算符  `!==`", 5 !== '5'); // 结果为 true
    console.log("4. 不全等运算符  `!==`", 123 !== info); // 结果为 true
    // console.log("4. 不全等运算符  `!==`", 123 !== [123]); // 结果为 true

    // 5. 大于运算符  `>` - 检查左侧的值是否大于右侧的值。
    console.log("5. 大于运算符  `>`", 5 > 3); // 结果为 true
    console.log("5. 大于运算符  `>`", 5 > info); // 结果为 false
    console.log("5. 大于运算符  `>`", 5 > [3]); // 结果为 true

    // 6. 大于等于运算符  `>=` - 检查左侧的值是否大于或等于右侧的值。
    console.log("6. 大于等于运算符  `>=`", 5 >= 5); // 结果为 true
    console.log("6. 大于等于运算符  `>=`", 5 >= info); // 结果为 false
    console.log("6. 大于等于运算符  `>=`", 5 >= [3]); // 结果为 true

    // 7. 小于运算符  `<` - 检查左侧的值是否小于右侧的值。
    console.log("7. 小于运算符  `<` ", 3 < 5); // 结果为 true
    console.log("7. 小于运算符  `<` ", 5 < info); // 结果为 true
    console.log("7. 小于运算符  `<` ", 5 < [3]); // 结果为 false

    // 8. 小于等于运算符  `<=` - 检查左侧的值是否小于或等于右侧的值。
    console.log("8. 小于等于运算符  `<=`", 5 <= 5); // 结果为 true
    console.log("8. 小于等于运算符  `<=`", 5 <= info); // 结果为 true
    console.log("8. 小于等于运算符  `<=`", 5 <= [3]); // 结果为 false
    

  </script>
  
</body>
</html>